<!-- #ifdef APP-PLUS -->
<template>
	<view>
		<div style="width:100%;height:98vh;" id="myMapView" :datas="outdata" :change:datas="myMapView.inshowdatas"
			:mcenter="outcenter" :change:mcenter="myMapView.mgocenter">
		</div>
		<image v-if="outisimage" style="position:fixed ;right: 3vh;top: 5vh;z-index: 999;width: 40px;height: 40px;"
			@click="myMapView.toggleimg" src='https://project.gxrunxiang.com/cdn/vec.jpg'></image>
		<image v-if="!outisimage" style="position:fixed ;right: 3vh;top: 5vh;z-index: 999;width: 40px;height: 40px"
			@click="myMapView.toggleimg" src='https://project.gxrunxiang.com/cdn/img.jpg'></image>
		<u-button @click="open" :disabled=isOpen
			style="width: 80px; font-size: 15px; position:fixed ; right: 3vh; top: 11vh;z-index: 999; height: 40px"
			v-if="islocated">开启</u-button>
		<u-button @click="close" :disabled=!isOpen
			style="width: 80px; font-size: 15px; position:fixed ; right: 3vh; top: 18vh;z-index: 999; height: 40px"
			v-if="islocated">关闭</u-button>
		<u-button @click="iscar = !iscar"
			style="width: 110px; font-size: 15px; position:fixed ; right: 3vh; top: 25vh;z-index: 999; height: 40px"
			v-if="islocated && !iscar">切换为驾车</u-button>
		<u-button @click="iscar = !iscar"
			style="width: 110px; font-size: 15px; position:fixed ; right: 3vh; top: 25vh;z-index: 999; height: 40px"
			v-if="islocated && iscar">切换为步行</u-button>
	</view>
</template>
<!-- #endif-->

<script>
	//#ifdef APP_PLUS
	const keepAlive = uni.requireNativePlugin('Ba-KeepAlive')
	import {
		addLineCheck,
		getCheckLine
	} from '@/common/api.js'
	import locationWatcher from '@/common/locationWatcher.js'
	import {
		login
	} from '../../common/api';
	export default {
		data() {
			return {
				locationWatcherId: '', //监听器id
				maximumAge: 5 * 1000, //间隔时间5s
				islocated: false,
				outdata: [],
				outisimage: false,
				outcenter: [108.1, 23],
				ismapready: false,
				urls: [],
				userinfo: {},
				show: false,
				isOpen: false,
				iscar: false
			}
		},
		methods: {
			//开启定位功能
			open() {
				this.register()
				this.isRunning()
				this.whiteList()
				this.isOpen = true
				// 定义阈值
				const carspeedThreshold = 40; // 驾车速度阈值，单位为m/s
				const caraccelerationThreshold = 4; // 驾车加速度阈值，单位为m/s^2
				const speedThreshold = 1.8; // 步行速度阈值，单位为m/s
				const accelerationThreshold = 1.8; // 步行加速度阈值，单位为m/s^2

				// 过滤GPS飘逸点的函数
				function filterGPSPoints(points, iscar) {
					// 如果点的数量小于等于2，直接返回原始点集合
					if (points.length <= 2) {
						return points;
					}

					// 过滤后的点集合
					const filteredPoints = [points[0]];

					// 遍历原始点集合
					for (let i = 1; i < points.length - 1; i++) {
						const prevPoint = points[i - 1];
						const currentPoint = points[i];
						const nextPoint = points[i + 1];
						// 计算当前点的速度和加速度
						const speed = calculateSpeed(prevPoint, currentPoint);
						const acceleration = calculateAcceleration(prevPoint, currentPoint, nextPoint);

						// 如果速度和加速度都低于阈值，认为是有效点，加入过滤后的点集合
						if (iscar) {
							if (speed <= carspeedThreshold && acceleration <= caraccelerationThreshold) {
								filteredPoints.push(currentPoint);
							}
						} else {
							if (speed <= speedThreshold && acceleration <= accelerationThreshold) {
								filteredPoints.push(currentPoint);
							}
						}
					}

					// 加入最后一个点
					filteredPoints.push(points[points.length - 1]);

					return filteredPoints;
				}

				// 计算两个点之间的速度
				function calculateSpeed(prevPoint, currentPoint) {
					const distance = calculateDistance(prevPoint, currentPoint);
					const Time = (parseFloat(currentPoint.creatorId) - parseFloat(prevPoint.creatorId)) /
						1000; // 假设CreatorIdstamp是时间戳
					return distance / Time;
				}

				// 计算三个点之间的加速度
				function calculateAcceleration(prevPoint, currentPoint, nextPoint) {
					const speed1 = calculateSpeed(prevPoint, currentPoint);
					const speed2 = calculateSpeed(currentPoint, nextPoint);
					const Time = (parseFloat(nextPoint.creatorId) - parseFloat(prevPoint.creatorId)) /
						1000; // 假设CreatorIdstamp是时间戳

					return (speed2 - speed1) / Time;
				}

				// 计算两个点之间的距离
				function calculateDistance(point1, point2) {
					const lat1 = point1.lat;
					const lon1 = point1.lng;
					const lat2 = point2.lat;
					const lon2 = point2.lng;

					const R = 6371; // 地球半径，单位为km

					const dLat = deg2rad(lat2 - lat1);
					const dLon = deg2rad(lon2 - lon1);

					const a =
						Math.sin(dLat / 2) * Math.sin(dLat / 2) +
						Math.cos(deg2rad(lat1)) * Math.cos(deg2rad(lat2)) * Math.sin(dLon / 2) * Math.sin(dLon / 2);

					const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));

					const distance = R * c * 1000; // 转换为米

					return distance;
				}

				// 将角度转换为弧度
				function deg2rad(deg) {
					return deg * (Math.PI / 180);
				}


				function dateFormat(date, fmt = "yyyy年MM月dd日") {
					if (date == null) return null;
					if (typeof date === "string") {
						date = date.slice(0, 19).replace("T", " ").replace(/-/g, "/");
						date = new Date(date);
					} else if (typeof date === "number") {
						date = new Date(date);
					}
					var o = {
						"M+": date.getMonth() + 1,
						"[Dd]+": date.getDate(),
						"h+": date.getHours(),
						"m+": date.getMinutes(),
						"s+": date.getSeconds(),
						"q+": Math.floor((date.getMonth() + 3) / 3),
						S: date.getMilliseconds(),
					};
					if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1
						.length));
					for (var k in o) {
						if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, RegExp.$1.length === 1 ? o[
							k] : ("00" + o[k]).substr(("" + o[k]).length));
					}
					return fmt;
				}
				var paths = []
				var points = []
				locationWatcher.startLocationService(e => {
					let {
						latitude,
						longitude
					} = e.position
					let point = {}
					point.lat = latitude
					point.lng = longitude
					point.creatorId = Date.now().toString()
					point.id = null
					point.deptids = null
					point.createTime = dateFormat(new Date(), 'yyyy年MM月DD日 hh:mm:ss')
					points.push(point);
					paths = filterGPSPoints(points, this.iscar);
					console.log(paths);
					if (paths.length >= 3) {
						addLineCheck(paths).then((res) => {
							if (res === true) {
								points = []
								this.getcheckline()
							}
						})
					}
					if (!getApp().globalData.locationWatcherId) {
						getApp().globalData.locationWatcherId = e.locationWatcherId //缓存到全局
					}
				}, (e) => {
					console.log(e, '定位失败')
				}, this.maximumAge)
			},

			//关闭定位
			close() {
				this.isOpen = false
				this.unregister()
				getApp().globalData.locationWatcherId && locationWatcher.closeLocationService(getApp().globalData
					.locationWatcherId)
				getApp().globalData.locationWatcherId = ''
			},

			//保活注册
			register() {
				keepAlive.register({
						channelId: 'checkline',
						channelName: '润象工程项目管理系统移动版',
						title: '润象工程项目管理系统移动版',
						content: '巡线正在运行中',
					},
					(res) => {
						console.log(res);
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 3000
						})
					});
			},

			//保活是否正在运行
			isRunning() {
				keepAlive.isRunning((res) => {
					console.log(res);
					uni.showToast({
						title: res.msg,
						icon: "none",
						duration: 3000
					})
				});
			},

			//获取并打开白名单
			whiteList() {
				keepAlive.whiteList({
					isDialog: true,
					reason: "持续定位服务",
					whiteType: 0,
				}, (res) => {
					console.log(res);
					uni.showToast({
						title: res.msg,
						icon: "none",
						duration: 3000
					})
				});
			},

			//保活注销
			unregister() {
				keepAlive.unregister((res) => {
					if(res.msg == 'success')
					uni.showToast({
						title: '已关闭',
						icon: "none",
						duration: 3000
					})
				});
			},

			containerclick() {},

			mapready() {
				this.ismapready = true
			},

			goline(latlng) {
				var i = [parseFloat(latlng.split(',')[1]), parseFloat(latlng.split(',')[0])]
				this.outcenter = i
			},
			outlocation() {
				uni.getLocation({
					type: 'wgs84',
					geocode: true, //设置该参数为true可直接获取经纬度及城市信息
					success: (res) => {
						// console.log("定位结果" + res.longitude + "，" + res.latitude)
						// that.addrDel = res;
						this.outcenter = [res.longitude, res.latitude]
						this.islocated = true
					},
					fail: () => {
						// this.outcenter = [111.11111, 11.111111]
						// console.log("定位结果失败")
						// console.log(this)
						uni.showToast({
							title: '获取地址失败，将导致部分功能不可用',
							icon: 'none'
						});
					}
				});
				// this.outcenter = [119,24]
			},
			islocationWatcherId() {
				if (getApp().globalData.locationWatcherId) {
					console.log(getApp().globalData.locationWatcherId);
					this.isOpen = true
				}
			},
			// if(getApp().globalData.locationWatcherId){
			// 	console.log(getApp().globalData.locationWatcherId);
			// 	this.isOpen = true
			// }
			// outselect(i) {
			// 	// let i = this.view.extent.center.latitude + "," + this.view.extent.center.longitude
			// 	uni.navigateTo({
			// 		url: `point?latlng=${i}`
			// 	})
			// },
			changeimage(e) {
				this.outisimage = e;
			},
			popon(e) {
				// console.log("e")
				// console.log(e)
				// this.urls = []
				this.loading = true
				var tempitem = []
				for (var i = 0; i < e.length; i++) {
					e[i].graphic.attributes.urls = []
					if (e[i].graphic.attributes.ImageList) {
						e[i].graphic.attributes.ImageList.forEach((element) => {
							e[i].graphic.attributes.urls.push(`${baseUrl}/SysFile/download?id=${element.Id}`)
						});
						tempitem.push(e[i].graphic.attributes)
					}
				}

				// this.item = e
				this.items = tempitem
				this.showpop = true;
				this.loading = false;
			},
			getcheckline() {
				let formatDate = function(date) {
					var y = date.getFullYear();
					var m = date.getMonth() + 1;
					m = m < 10 ? '0' + m : m;
					var d = date.getDate();
					d = d < 10 ? ('0' + d) : d;
					return y + '-' + m + '-' + d;
				};
				let time = formatDate(new Date())
				let createdId = []
				createdId.push(this.userinfo.Id)
				getCheckLine(time, createdId).then((res) => {
					this.outdata = res
				})
			}
		},
		onLoad() {
			this.userinfo = JSON.parse(uni.getStorageSync("$userinfo"))
		},
		onShow() {
			if (this.ismapready) {
				this.getcheckline()
			}
		},
		mounted() {
			// this.createMapView()
			// 页面初始化完成后
			var this_ = this;
			this.createMapView().then(() => {
				console.log("加载地图的promise执行结束了....")
				// 打印地图对象
				console.log(this.myMapObject.map);
				// this_.myMapObject.view.on("drag", e=> {
				// 			let i = view.extent.center.latitude + "," + view.extent.center
				// 				.longitude
				// 			this.latlng=i;
				// 			// this.ondrag(i)
				// 			// console.log(this_.latlng)

				// 		})
				// 调用createMapView()内部的方法
				// this.myMapObject.methodForOutSide();
				// console.log(this.myMapObject.gocenter)
				this.$ownerInstance.callMethod('outlocation', {});
				this.$ownerInstance.callMethod('mapready', {});
			});
		},

	}
	//#endif
</script>

<script module="myMapView" lang="renderjs">
	//#ifdef APP_PLUS
	import {
		loadModules
	} from 'esri-loader'
	import {
		baseUrl
	} from '@/common/config.js'
	export default {
		name: 'myMapView',
		data() {
			return {
				modules: [
					"esri/Map",
					"esri/views/MapView",
					"esri/Basemap",
					"esri/layers/Layer",
					"esri/layers/TileLayer",
					"esri/layers/WebTileLayer",
					"esri/layers/support/TileInfo",
					"esri/widgets/Locate",
					"esri/Graphic",
					"esri/PopupTemplate",
					"esri/widgets/ScaleBar",
				],
				view: "",
				gisConstructor: {},
				map: {},
				basemap2: {},
				basemap1: {},
				isimage: false,

				myMapObject: {}, // 对象，存储关于地图的图层、方法、属性等
				latlng: "",

			}
		},
		methods: {
			toggleimg(event, ownerInstance) {
				this.isimage = !this.isimage
				this.map.basemap = this.isimage ? this.basemap2 : this.basemap1
				ownerInstance.callMethod('changeimage', this.isimage)
			},


			ingetdata(that) {
				that.$ownerInstance.callMethod('getcheckline', {
					val1: "参数1",
					val2: "参数2"
				});

			},
			// inselect(event, ownerInstance) {
			// 	let i = this.view.extent.center.latitude + "," + this.view.extent.center.longitude
			// 	// uni.navigateTo({
			// 	// 	url: `point?latlng=${i}`
			// 	// })event, ownerInstance
			// 	ownerInstance.callMethod('outselect', i)
			// },



			inshowdatas(v) {
				// console.log('inshowdatas')
				if (this.myMapObject.showdatas)
					this.myMapObject.showdatas(v)
			},
			mgocenter(center) {
				// console.log("触发ingocenter")
				// console.log(center)
				if (this.myMapObject.gocenter)
					this.myMapObject.gocenter(center)
			},

			createMapView() {

				const options = {
					url: 'https://js.arcgis.com/4.24/init.js',
					css: 'https://js.arcgis.com/4.24/esri/themes/light/main.css'
				};
				return new Promise((resolve, reject) => {
					loadModules(this.modules, options).then(([
						Map,
						MapView,
						Basemap,
						Layer,
						TileLayer,
						WebTileLayer,
						TileInfo,
						Locate,
						Graphic,
						PopupTemplate,
						ScaleBar,
					]) => {
						// console.log(args)
						// console.log(args)
						// for (let k in args) {
						// 	let name = this.modules[k].split('/').pop()
						// 	name = name.replace(name[0], name[0].toUpperCase())
						// 	this.gisConstructor[name] = args[k];
						// }
						var tileInfo = new TileInfo({
							dpi: 90.71428571427429,
							rows: 256,
							cols: 256,
							compressionQuality: 0,
							origin: {
								x: -180,
								y: 90
							},
							spatialReference: {
								wkid: 4490
							},
							lods: [{
								level: 0,
								levelValue: 1,
								resolution: 0.703125,
								scale: 295497593.05875003
							}, {
								level: 1,
								levelValue: 2,
								resolution: 0.3515625,
								scale: 147748796.52937502
							}, {
								level: 2,
								levelValue: 3,
								resolution: 0.17578125,
								scale: 73874398.264687508
							}, {
								level: 3,
								levelValue: 4,
								resolution: 0.087890625,
								scale: 36937199.132343754
							}, {
								level: 4,
								levelValue: 5,
								resolution: 0.0439453125,
								scale: 18468599.566171877
							}, {
								level: 5,
								levelValue: 6,
								resolution: 0.02197265625,
								scale: 9234299.7830859385
							}, {
								level: 6,
								levelValue: 7,
								resolution: 0.010986328125,
								scale: 4617149.8915429693
							}, {
								level: 7,
								levelValue: 8,
								resolution: 0.0054931640625,
								scale: 2308574.9457714846
							}, {
								level: 8,
								levelValue: 9,
								resolution: 0.00274658203125,
								scale: 1154287.4728857423
							}, {
								level: 9,
								levelValue: 10,
								resolution: 0.001373291015625,
								scale: 577143.73644287116
							}, {
								level: 10,
								levelValue: 11,
								resolution: 0.0006866455078125,
								scale: 288571.86822143558
							}, {
								level: 11,
								levelValue: 12,
								resolution: 0.00034332275390625,
								scale: 144285.93411071779
							}, {
								level: 12,
								levelValue: 13,
								resolution: 0.000171661376953125,
								scale: 72142.967055358895
							}, {
								level: 13,
								levelValue: 14,
								resolution: 8.58306884765625e-005,
								scale: 36071.483527679447
							}, {
								level: 14,
								levelValue: 15,
								resolution: 4.291534423828125e-005,
								scale: 18035.741763839724
							}, {
								level: 15,
								levelValue: 16,
								resolution: 2.1457672119140625e-005,
								scale: 9017.8708819198619
							}, {
								level: 16,
								levelValue: 17,
								resolution: 1.0728836059570313e-005,
								scale: 4508.9354409599309
							}, {
								level: 17,
								levelValue: 18,
								resolution: 5.3644180297851563e-006,
								scale: 2254.4677204799655
							}, {
								level: 18,
								levelValue: 19,
								resolution: 2.68220901489257815e-006,
								scale: 1127.23386023998275
							}, {
								level: 19,
								levelValue: 20,
								resolution: 1.341104507446289075e-006,
								scale: 563.616930119991375
							}]
						});
						let key = '03e5fbb70693a7fe79505f823f719616';
						let vec = new WebTileLayer({
							urlTemplate: "https://{subDomain}.tianditu.gov.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TileMatrix={level}&TileCol={col}&TileRow={row}&tk=" +
								key,
							subDomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
							copyright: "天地图影像",
							tileInfo: tileInfo,
							spatialReference: {
								wkid: 4490
							} //重点在这一句,如果不指定,那么默认为102100,在前端就会报坐标系的错误
						});

						var veczj = new WebTileLayer({
							urlTemplate: "https://{subDomain}.tianditu.gov.cn/cva_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TileMatrix={level}&TileCol={col}&TileRow={row}&tk=" +
								key,
							subDomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
							copyright: "天地图影像注记",
							tileInfo: tileInfo,
							spatialReference: {
								wkid: 4490
							} //重点在这一句,如果不指定,那么默认为102100,在前端就会报坐标系的错误
						});
						let img = new WebTileLayer({
							urlTemplate: "https://{subDomain}.tianditu.gov.cn/img_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TileMatrix={level}&TileCol={col}&TileRow={row}&tk=" +
								key,
							subDomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
							copyright: "天地图影像",
							tileInfo: tileInfo,
							spatialReference: {
								wkid: 4490
							} //重点在这一句,如果不指定,那么默认为102100,在前端就会报坐标系的错误
						});

						var imgzj = new WebTileLayer({
							urlTemplate: "https://{subDomain}.tianditu.gov.cn/cia_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TileMatrix={level}&TileCol={col}&TileRow={row}&tk=" +
								key,
							subDomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
							copyright: "天地图影像注记",
							tileInfo: tileInfo,
							spatialReference: {
								wkid: 4490
							} //重点在这一句,如果不指定,那么默认为102100,在前端就会报坐标系的错误
						});
						this.basemap1 = new Basemap({
							baseLayers: [vec, veczj],
							title: "天地图矢量",
							id: "basemap1"
						});
						this.basemap2 = new Basemap({
							baseLayers: [img, imgzj],
							title: "天地图影像",
							id: "basemap2"
						});
						this.map = new Map({
							spatialReference: {
								wkid: 4490
							},
							basemap: this.basemap1, // 底图置空
							// layers: [satelliteLayer, anoBaseLayer], // 添加自定义的layer为底图

						});


						// 创建一个mapView并绑定页面元素
						var view = new MapView({
							spatialReference: {
								wkid: 4490
							},
							container: "myMapView",
							map: this.map,
							zoom: 15, // 缩放比例 值越大图越大
							center: [108.319884, 22.827034],

						});
						this.view = view
						this.view.on("drag", e => {
							let i = this.view.extent.center.latitude + "," + this.view.extent
								.center.longitude
							this.latlng = i;
							// this.ondrag(i)
							// console.log(this_.latlng)

						})
						let scaleBar = new ScaleBar({
							view: view,
							unit: "dual"
						});
						// Add widget to the bottom left corner of the view
						view.ui.add(scaleBar, {
							position: "bottom-left"
						});
						// view.goTo({
						// 	center: [108.11111, 22.22222],
						// 	zoom: 15
						// });


						const locateBtn = new Locate({
							view: this.view
						});

						// Add the locate widget to the top left corner of the view
						this.view.ui.add(locateBtn, {
							position: "bottom-right"
						});
						this.view.constraints = {

							minZoom: 6,

							maxZoom: 17,

						};
						// 给 “地图视图” 绑定点击事件
						this.view.on('click', e => {
							// hitTest 方法在点击位置上如果存在 Graphic（线或点），即可获取 Graphic 对象的整个数据
							// this.$ownerInstance.callMethod('setloading')
							this.$ownerInstance.callMethod('closeloading')
							this.view.hitTest(e)
								.then(res => {
									if (res.results.length > 0) {

										// 获取每个图形上的ID
										// this.$message.info(JSON.stringify(res.results[0].graphic.attributes))
										// this.$ownerInstance.callMethod('popon', res.results[0]
										// 	.graphic.attributes);
										// console.log(res)
										this.$ownerInstance.callMethod('popon', res.results)
										// 	.graphic.attributes);
									}






								})
						})

						// 地图加载完成事件


						// 定义myMapObject的方法供外部调用
						// this.myMapObject.methodForOutSide = function(val) {
						// 	console.log("methodForOutSide方法被调用了：" + val);
						// }
						this.myMapObject.showdatas = function(datas) {
							view.graphics.removeAll()


							var points = [];
							var lines = {};
							for (var i = 0; i < datas[0].LngLat.length; i++) {
								lines[i] = []
								var lat = datas[0].LngLat[i][1]
								var lng = datas[0].LngLat[i][0]
								lat = parseFloat(lat)
								lng = parseFloat(lng)
								lines[0].push([lng, lat])
								if (i == 0) {
									let point = new Graphic({
										geometry: {
											type: "point",
											longitude: parseFloat(datas[0].LngLat[i][0]),
											latitude: parseFloat(datas[0].LngLat[i][1])
										},
										symbol: {
											type: "simple-marker",
											color: '#22c30c',
										},
										Id: datas[0].CreatorId
									})
									view.graphics.add(point)
								} else if (i == datas[0].LngLat.length - 1) {
									let point = new Graphic({
										geometry: {
											type: "point",
											longitude: parseFloat(datas[0].LngLat[i][0]),
											latitude: parseFloat(datas[0].LngLat[i][1])
										},
										symbol: {
											type: "simple-marker",
											color: '#fe2c24',
										},
										Id: datas[0].CreatorId
									})
									view.graphics.add(point)
								}
								// points.push(this.createpoint(datas[0].LngLat[i]))
								// if (!lines[datas[0].LngLat[i].Name])
								// 	lines[datas[0].LngLat[i].Name] = [];
							}
							console.log(lines[0]);
							// if (points.length > 0)
							// 	console.log("view")
							// console.log(view)
							// view.graphics.addMany(points)

							// for (var i in lines) {
							// 	if (lines[i].length > 1)
							// 		view.graphics.add(this.createline(lines[i]))
							// }
							view.graphics.add(this.createline(lines[0]))
							// this.view.graphics.add(this.createline(lines[i]))

						}
						this.myMapObject.createline = function(linearr) {
							const polyline = {
								type: "polyline", // autocasts as new Polyline()
								paths: linearr

							};

							// Create a symbol for drawing the line
							const lineSymbol = {
								type: "simple-line", // autocasts as SimpleLineSymbol()
								color: [226, 119, 40],
								width: 4
							};


							const polylineGraphic = new Graphic({
								geometry: polyline,
								symbol: lineSymbol,

							});
							return polylineGraphic;
						}
						this.myMapObject.gocenter = function(center) {
							console.log("ob内部的gocenter")
							view.goTo({
								center: center,
								zoom: 16
							});
						}
						this.myMapObject.createpoint = function(item) {
								var lat = item.Latlng.split(',')[0]
								var lng = item.Latlng.split(',')[1]
								lat = parseFloat(lat)
								lng = parseFloat(lng)
								const point = {
									type: "point", // autocasts as new Point()
									longitude: lng,
									latitude: lat
								};

								var content = "线路名称:" + item.Name + "</br>铺设类型:" + item.BuildType +
									"</br>序号：" + item.Idx +
									"</br>备注：" + item.Remark + "</br>"
								if (item.ImageList)
									for (var i = 0; i < item.ImageList.length; i++) {
										content +=
											`<img style='width:50px;heigth:50px' src='${baseUrl}/SysFile/download?id=${item.ImageList[i].Id}'/>`
									}
								// content+="<br><a href=''"	
								// console.log("createpoint")
								// console.log(args)
								// console.log(this.gisConstructor)
								// console.log(this.createpoint)
								var popupTemplate = new PopupTemplate({
									// "title": item.Name,
									"content": content
								})
								// Create a symbol for drawing the point
								const markerSymbol = {
									type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
									color: [226, 119, 40],
									outline: {
										// autocasts as new SimpleLineSymbol()
										color: [255, 255, 255],
										width: 2
									}
								};

								// Create a graphic and add the geometry and symbol to it
								const pointGraphic = new Graphic({
									geometry: point,
									symbol: markerSymbol,
									// popupTemplate: popupTemplate,
								});

								pointGraphic.attributes = item
								return pointGraphic
							},
							this.myMapObject.map = this.map;
						// 地图加载完成事件
						this.view.when(function() {
							resolve();
							console.log("地图加载完成了！");

						});
						// this.outlocation()
					})
				})

			},

		},
		mounted() {

			// this.createMapView()
			// 页面初始化完成后
			var this_ = this;
			this.createMapView().then(() => {
				console.log("加载地图的promise执行结束了....")
				// 打印地图对象
				console.log(this.myMapObject.map);
				// this_.myMapObject.view.on("drag", e=> {
				// 			let i = view.extent.center.latitude + "," + view.extent.center
				// 				.longitude
				// 			this.latlng=i;
				// 			// this.ondrag(i)
				// 			// console.log(this_.latlng)

				// 		})
				// 调用createMapView()内部的方法
				// this.myMapObject.methodForOutSide();
				// console.log(this.myMapObject.gocenter);
				this.ingetdata(this);
				this.$ownerInstance.callMethod('islocationWatcherId', {});
				// this.$ownerInstance.callMethod('register', {});
				// this.$ownerInstance.callMethod('isRunning', {});
				// this.$ownerInstance.callMethod('whiteList', {});
				this.$ownerInstance.callMethod('outlocation', {});
				this.$ownerInstance.callMethod('mapready', {});
			});

		},
	}
	//#endif
</script>

<style>
	/deep/.esri-widget--button {
		display: none;
	}

	/deep/.esri-attribution__powered-by {
		display: none;
	}

	/deep/.esri-view .esri-view-surface--inset-outline:focus::after {
		outline: none;
	}

	.center {
		/* background: green; */
		position: absolute;
		width: 50px;
		height: 100px;
		left: 50%;
		top: 50%;
		margin-left: -25px;
		margin-top: -100px;
		z-index: 999;
	}
</style>